<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <link rel="apple-touch-icon" sizes="76x76" href="./assets/img/favicon.ico" />
    <link rel="icon" type="image/png" href="./assets/img/favicon.ico" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <title>Anchor Bootstrap 4.1.3 UI Kit by WowThemesNet</title>
    <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0, shrink-to-fit=no" name="viewport" />

    <!-- Google Font -->
    <link href="https://fonts.googleapis.com/css?family=Nunito:300,300i,400,600,800" rel="stylesheet" />

    <!-- Font Awesome Icons -->
    <link
      rel="stylesheet"
      href="https://use.fontawesome.com/releases/v5.3.1/css/all.css"
      integrity="sha384-mzrmE5qonljUremFsqc01SB46JvROS7bZs3IO2EmfFsd15uHvIt+Y8vEf7N7fWAU"
      crossorigin="anonymous"
    />

    <!-- Main CSS -->
    <link href="./assets/css/main.css" rel="stylesheet" />
    <link href="./assets/css/vendor/swiper.min.css" rel="stylesheet" />
    <link href="./assets/css/home.css" rel="stylesheet" />

    <!-- Animation CSS -->
    <link href="./assets/css/vendor/aos.css" rel="stylesheet" />
  </head>
	
  <body>
    <!-- 顶部 logo start-->
    <div class="topBox">
      <div class="topBoxInner">
        <img class="logoImg" src="./assets/img/home/logo.png" />
      </div>
    </div>
		<!-- 顶部 logo end-->

		<!-- banner start-->
    <div class="bannerBox">
			<div id='nav-position'>
				<div class='boxInner'>
					<div>首页</div>
					<div>学校概况</div>
					<div>新闻资讯</div>
					<div>党建引领</div>
					<div>教育教学</div>
					<div>乐龄风采</div>
					<div>志愿服务</div>
				</div>
			</div>
      <div class='bot-position'>
				<div class='bot-position-inner'>
					<div class='notice-box'>
						<div class='left'>
							<img src="./assets/img/home/notice.png" alt="">
						</div>
					</div>
					<div class="swiper-container">
						<div class="swiper-wrapper">
							<div class="swiper-slide">
								<div class='mid'>
									重要通知：哇哈哈总部哇哈哈总部哇哈哈总部哇哈哈总部哇哈哈总对妇女节部哇哈哈总部哇哈哈总部哇哈哈总部哇哈哈总部哇哈哈总部哇哈是对妇女节哈总的等待风格和你啊点睡部哇哈哈总部哇哈哈总部哇哈哈总部哇哈哈总部哇哈哈总部
								</div>
								<div class='right'>
									2024年04月08日
								</div>
							</div>
							<div class="swiper-slide">
								<div class='mid'>
									重要通知：哇哈哈总部哇哈哈总部哇哈哈总部哇哈哈总部哇哈哈总对妇女节部哇哈哈总部哇哈哈总部哇哈哈总部哇哈哈总部哇哈哈总部哇哈是对妇女节哈总的等待风格和你啊点睡部哇哈哈总部哇哈哈总部哇哈哈总部哇哈哈总部哇哈哈总部
								</div>
								<div class='right'>
									2024年04月08日
								</div>
							</div><div class="swiper-slide">
								<div class='mid'>
									重要通知：哇哈哈总部哇哈哈总部哇哈哈总部哇哈哈总部哇哈哈总对妇女节部哇哈哈总部哇哈哈总部哇哈哈总部哇哈哈总部哇哈哈总部哇哈是对妇女节哈总的等待风格和你啊点睡部哇哈哈总部哇哈哈总部哇哈哈总部哇哈哈总部哇哈哈总部
								</div>
								<div class='right'>
									2024年04月08日
								</div>
							</div>
						</div>
						<!-- Swiper -->
					</div>
				</div>
			</div>
			</div>
    </div>
		<!-- banner end-->

		<!-- news start -->
		 <div class='news-box' data-aos="fade-up">
			<div class='news-inner'>
				<section class="pt-5 pb-5" >
					<div class='news-top'>
						<ul class="nav nav-tabs" style='border: none;'>
							<li class="active"><a href="#home" data-toggle="tab">综合信息</a></li>
							<li><a href="#profile" data-toggle="tab">区县工作</a></li>
						</ul>
						<div>
							right
						</div>
					</div>
					<div class='news-content'>
						<div class="row">
							<div class="col-xs-12 col-md-7 news-list-box">
								<div class='news-list'>
									<div class='imgBox'></div>
									<div class='news-left-right'>
										<div class='right-top'>
											<p class='title'>【工作动态】济南老年人大学召开警示教育会济南老年人大学召开警示教育会年人大学召开警示教育会年人大学召开警示教育会</p>
											<p class='date'>2024-08-02</p>
										</div>
										<div class='right-bottom'>
											济南老年人大学召开警示教育会济南老年人大学召开警示教育会年人大学召开警示教育会年人大学召开警示教育,济南老年人大学召开警示教育会济南老年人大学召开警示教育会年人大学召开警示教育会年人大学召开警示教育,济南老年人大学召开警示教育会济南老年人大学召开警示教育会年人大学召开警示教育会年人大学召开警示教育.
										</div>
									</div>
								</div>
								<div class='news-list'>
									<div class='imgBox'></div>
									<div class='news-left-right'>
										<div class='right-top'>
											<p class='title'>【工作动态】济南老年人大学召开警示教育会济南老年人大学召开警示教育会年人大学召开警示教育会年人大学召开警示教育会</p>
											<p class='date'>2024-08-02</p>
										</div>
										<div class='right-bottom'>
											济南老年人大学召开警示教育会济南老年人大学召开警示教育会年人大学召开警示教育会年人大学召开警示教育,济南老年人大学召开警示教育会济南老年人大学召开警示教育会年人大学召开警示教育会年人大学召开警示教育,济南老年人大学召开警示教育会济南老年人大学召开警示教育会年人大学召开警示教育会年人大学召开警示教育.
										</div>
									</div>
								</div>
								<div class='news-list'>
									<div class='imgBox'></div>
									<div class='news-left-right'>
										<div class='right-top'>
											<p class='title'>【工作动态】济南老年人大学召开警示教育会济南老年人大学召开警示教育会年人大学召开警示教育会年人大学召开警示教育会</p>
											<p class='date'>2024-08-02</p>
										</div>
										<div class='right-bottom'>
											济南老年人大学召开警示教育会济南老年人大学召开警示教育会年人大学召开警示教育会年人大学召开警示教育,济南老年人大学召开警示教育会济南老年人大学召开警示教育会年人大学召开警示教育会年人大学召开警示教育,济南老年人大学召开警示教育会济南老年人大学召开警示教育会年人大学召开警示教育会年人大学召开警示教育.
										</div>
									</div>
								</div>
								<div class='news-list'>
									<div class='imgBox'></div>
									<div class='news-left-right'>
										<div class='right-top'>
											<p class='title'>【工作动态】济南老年人大学召开警示教育会济南老年人大学召开警示教育会年人大学召开警示教育会年人大学召开警示教育会</p>
											<p class='date'>2024-08-02</p>
										</div>
										<div class='right-bottom'>
											济南老年人大学召开警示教育会济南老年人大学召开警示教育会年人大学召开警示教育会年人大学召开警示教育,济南老年人大学召开警示教育会济南老年人大学召开警示教育会年人大学召开警示教育会年人大学召开警示教育,济南老年人大学召开警示教育会济南老年人大学召开警示教育会年人大学召开警示教育会年人大学召开警示教育.
										</div>
									</div>
								</div>
								
							</div>
							<div class="col-xs-12 col-md-5">
								<div class='news-banner'>
									<div class='banner-top'>
										<!-- Swiper -->
											<div class="swiper-container2">
												<div class="swiper-wrapper">
														<div class="swiper-slide">Slide 1</div>
														<div class="swiper-slide">Slide 2</div>
														<div class="swiper-slide">Slide 3</div>
														<div class="swiper-slide">Slide 4</div>
														<div class="swiper-slide">Slide 5</div>
														<div class="swiper-slide">Slide 6</div>
														<div class="swiper-slide">Slide 7</div>
														<div class="swiper-slide">Slide 8</div>
														<div class="swiper-slide">Slide 9</div>
														<div class="swiper-slide">Slide 10</div>
												</div>
												<!-- Add Pagination -->
												<div class="swiper-pagination"></div>
										</div>
									</div>
									<div class='banner-mid'>
										<div class='title'>
											济南老年人大学2024年秋季茶艺培训提升班招生简章济南老年人大学2024年秋季茶艺培训提升班招生简章
										</div>
										<div class='date'>08-02</div>
									</div>
									<div class='banner-bottom'>
										为方便济南老年朋友报名，济南 12345 热线与济南老年人大学深度合作，市民可以拨打热线电话提供自己的姓名和身份证号等信息，由…
									</div>
								</div>
							</div>
						</div>
					</div>
				</section>
			</div>
		</div>
		<!-- news end -->

		<!-- quick start -->
		 <div class='quick-box' data-aos="fade-right">
			<div class='quick-box-inner'>
				<div class='top'>
					<div class="left">
						快速通道
					</div>
					<div class="right"></div>
				</div>
				<div class='bottom'>
					
					<div class='bottom-inner'>
						<img src='./assets/img/home/quick/zhengce.png'>
						<div class='title-inner'>
							<div class='title'>
								<div class='title-pos'>
									招生政策
								</div>
							</div>
						</div>
					</div>
					<div class='bottom-inner'>
						<img src='./assets/img/home/quick/zhengce.png'>
						<div class='title-inner'>
							<div class='title'>
								<div class='title-pos'>
									招生政策
								</div>
							</div>
						</div>
					</div>
					<div class='bottom-inner'>
						<img src='./assets/img/home/quick/zhengce.png'>
						<div class='title-inner'>
							<div class='title'>
								<div class='title-pos'>
									招生政策
								</div>
							</div>
						</div>
					</div>
					<div class='bottom-inner'>
						<img src='./assets/img/home/quick/zhengce.png'>
						<div class='title-inner'>
							<div class='title'>
								<div class='title-pos'>
									招生政策
								</div>
							</div>
						</div>
					</div>
					<div class='bottom-inner'>
						<img src='./assets/img/home/quick/zhengce.png'>
						<div class='title-inner'>
							<div class='title'>
								<div class='title-pos'>
									招生政策
								</div>
							</div>
						</div>
					</div>
					<div class='bottom-inner'>
						<img src='./assets/img/home/quick/zhengce.png'>
						<div class='title-inner'>
							<div class='title'>
								<div class='title-pos'>
									招生政策
								</div>
							</div>
						</div>
					</div>
					<div class='bottom-inner'>
						<img src='./assets/img/home/quick/zhengce.png'>
						<div class='title-inner'>
							<div class='title'>
								<div class='title-pos'>
									招生政策
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		 </div>
		<!-- quick end -->

		<!-- study start -->
		<div class='study-box'></div>
		<!-- study end -->


    <header>
      <div class="jumbotron jumbotron-lg jumbotron-fluid mb-0 pb-3 bg-primary position-relative">
        <div class="container-fluid text-white h-100">
          <div class="d-lg-flex align-items-center justify-content-between text-center pl-lg-5">
            <div class="col pt-4 pb-4">
              <h1 class="display-3">Build something <strong>nice</strong> & easy</h1>
              <h5 class="font-weight-light mb-4">
                With this FREE Bootstrap 4.1.3<strong> UI Kit</strong> & <strong><i class="fab fa-sass fa-2x text-info"></i></strong>
              </h5>
              <a href="#" class="btn btn-lg btn-outline-white btn-round">Learn more</a>
            </div>
            <div class="col align-self-bottom align-items-right text-right h-max-380 h-xl-560 position-relative z-index-1">
              <img src="assets/img/demo/dashb.png" class="rounded img-fluid" />
            </div>
          </div>
        </div>
      </div>
      <svg
        style="-webkit-transform: rotate(-180deg); -moz-transform: rotate(-180deg); -o-transform: rotate(-180deg); transform: rotate(-180deg); margin-top: -1px"
        version="1.1"
        id="Layer_1"
        xmlns="http://www.w3.org/2000/svg"
        xmlns:xlink="http://www.w3.org/1999/xlink"
        x="0px"
        y="0px"
        viewbox="0 0 1440 126"
        style="enable-background: new 0 0 1440 126"
        xml:space="preserve"
      >
        <path class="bg-primary" d="M685.6,38.8C418.7-11.1,170.2,9.9,0,30v96h1440V30C1252.7,52.2,1010,99.4,685.6,38.8z" />
      </svg>
    </header>
    <!--- END HEADER -->

    <main class="container">
     


     
    </main>

    <!--------------------------------------
END DEMO MODAL & DONATE BUTTON
--------------------------------------->

    <!--------------------------------------
FOOTER
--------------------------------------->
    <svg
      version="1.1"
      id="Layer_1"
      xmlns="http://www.w3.org/2000/svg"
      xmlns:xlink="http://www.w3.org/1999/xlink"
      x="0px"
      y="0px"
      viewbox="0 0 1440 126"
      style="enable-background: new 0 0 1440 126"
      xml:space="preserve"
    >
      <path class="bg-black" d="M685.6,38.8C418.7-11.1,170.2,9.9,0,30v96h1440V30C1252.7,52.2,1010,99.4,685.6,38.8z" />
    </svg>
    <footer class="bg-black pb-5">
      <div class="container">
        <div class="row">
          <div class="col-12 col-md mr-4">
            <i class="fas fa-copyright text-white"></i>
            <small class="d-block mt-3 text-muted"
              >©
              <script>
                document.write(new Date().getFullYear())
              </script>
              Anchor Bootstrap UI Kit, by Sal <a target="_blank" href="https://www.wowthemes.net">@wowthemesnet</a>. License MIT.
            </small>
          </div>
          <div class="col-6 col-md">
            <h5 class="mb-4 text-white">Features</h5>
            <ul class="list-unstyled text-small">
              <li><a class="text-muted" href="#">Cool stuff</a></li>
              <li><a class="text-muted" href="#">Random feature</a></li>
              <li><a class="text-muted" href="#">Team feature</a></li>
              <li><a class="text-muted" href="#">Stuff for developers</a></li>
            </ul>
          </div>
          <div class="col-6 col-md">
            <h5 class="mb-4 text-white">Resources</h5>
            <ul class="list-unstyled text-small">
              <li><a class="text-muted" href="#">Resource</a></li>
              <li><a class="text-muted" href="#">Resource name</a></li>
              <li><a class="text-muted" href="#">Another resource</a></li>
              <li><a class="text-muted" href="#">Final resource</a></li>
            </ul>
          </div>
          <div class="col-6 col-md">
            <h5 class="mb-4 text-white">Utilities</h5>
            <ul class="list-unstyled text-small">
              <li><a class="text-muted" href="#">Business</a></li>
              <li><a class="text-muted" href="#">Education</a></li>
              <li><a class="text-muted" href="#">Government</a></li>
              <li><a class="text-muted" href="#">Gaming</a></li>
            </ul>
          </div>
          <div class="col-6 col-md">
            <h5 class="mb-4 text-white">About</h5>
            <ul class="list-unstyled text-small">
              <li><a class="text-muted" href="#">Team</a></li>
              <li><a class="text-muted" href="#">Locations</a></li>
              <li><a class="text-muted" href="#">Privacy</a></li>
              <li><a class="text-muted" href="#">Terms</a></li>
            </ul>
          </div>
        </div>
      </div>
    </footer>

    <!--------------------------------------
JAVASCRIPTS
--------------------------------------->
    <script src="./assets/js/vendor/jquery.min.js" type="text/javascript"></script>
    <script src="./assets/js/vendor/popper.min.js" type="text/javascript"></script>
    <script src="./assets/js/vendor/bootstrap.min.js" type="text/javascript"></script>
    <script src="./assets/js/vendor/share.js" type="text/javascript"></script>
    <script src="./assets/js/functions.js" type="text/javascript"></script>
    <script src="./assets/js/vendor/swiper-3.4.2.jquery.min.js" type="text/javascript"></script>
		
    <!-- Animation -->
    <script src="./assets/js/vendor/aos.js" type="text/javascript"></script>
    <noscript>
      <style>
        *[data-aos] {
          display: block !important;
          opacity: 1 !important;
          visibility: visible !important;
        }
      </style>
    </noscript>
    <script>
      AOS.init({
        duration: 700,
      })
    </script>

    <!-- Disable animation on less than 1200px, change value if you like -->
    <script>
      AOS.init({
        disable: function () {
          var maxWidth = 1200
          return window.innerWidth < maxWidth
        },
      })
    </script>

    <!-- Carousel Height Smooth -->
    <script>
      $(".carousel").on("slide.bs.carousel", function (event) {
        var height = $(event.relatedTarget).height()
        var $innerCarousel = $(event.target).find(".carousel-inner")
        $innerCarousel.animate({
          height: height,
        })
      })
    </script>

    <!-- Popovers -->
    <script>
      $(function () {
        $('[data-toggle="popover"]').popover()
      })
      $(".popover-dismiss").popover({
        trigger: "focus",
      })
    </script>

    <!-- Tooltips -->
    <script>
      $(function () {
        $('[data-toggle="tooltip"]').tooltip()
      })
    </script>

		<!-- self -->
		<script>
			var swiper = new Swiper('.swiper-container', {
        paginationClickable: true,
        spaceBetween: 0,
        centeredSlides: true,
        autoplay: 1500,
				 // 当鼠标移动到Swiper上时，停止自动播放
  			autoplayDisableOnInteraction: false
    	});
			var swiper2 = new Swiper('.swiper-container2', {
        paginationClickable: true,
        spaceBetween: 0,
        centeredSlides: true,
        autoplay: 1500,
				 // 当鼠标移动到Swiper上时，停止自动播放
  			autoplayDisableOnInteraction: false
    	});


			$(window).scroll(function() {
				if ($(this).scrollTop() > 108) { // 100是滚动到页面顶部的距离
					$('#nav-position').addClass('nav-fixed');
				} else {
					$('#nav-position').removeClass('nav-fixed');
				}
			});
		</script>
  </body>
</html>
